<!DOCTYPE html>
<html>
 <head> 
  <meta http-equiv="Content-Type" content="text/html" ;="" charset="utf-8" /> 
  <title>注册</title> 
  <script src="https://cdn.staticfile.org/jquery/3.4.0/jquery.min.js"></script> 
  <script>
		$(document).ready(function(){
			var lasttime;
			$('#getCode').bind('click',function(){
				//判断获取验证的距离上次的时间是否超过1分钟
				var date = new Date();
				var now = date.getTime();
				if (lasttime == 'undefined'){
					lasttime == now;
				}else{
					if (now - lasttime < 60 * 1000){
						alert("距离上次获取验证码的时间不足一分钟，请耐心等待")
						return;
					}
					lasttime = now;
				}
				var email = $("[name='email']").val();
	        	$.get("/api/code/create/"+email,function(data,status){
            		if (data == true){
            			alert("发送成功，请去邮箱查看")
            		}else{
            			alert("发送失败，请重试");
            		}
        		});
			});

			$('#codeBtn').bind('click',function(){
				var email = $("[name='email']").val();
				var code = $("[name='code']").val();
				var password = $("[name='password']").val();
				// 先验证邮箱是否已经注册了
				var isRegistered = false;
        		$.ajax({
				    url: "/api/user/isRegistered/"+email,//请求路径
				    type: "GET",//GET
				    async: false,
				    success: function(resp) {
				    	if (resp == true){
				    		alert("该邮箱已经注册过")
				    		isRegistered = true;
				    	}
				    },
				    error: function(a, b, c) {
				    }
				});
        		if (isRegistered == true){
        			return;
        		}
	        	$.get("/api/user/register/"+email+"/"+password+"/"+code+"/",function(data,status){
            		if (data == true){
            			alert("注册成功")
            			//跳转到welcome.html
            			window.location.href = "/static/welcome.html";
            		}else{
            			alert("注册失败，请重试");
            		}
        		});
			})
		});
	</script>
  <style type="text/css">
	body {text-align: center;} 
    #center { margin-right: auto; margin-left: auto; } 
  header{
		width: 35%;/*这是设置宽,100%的意思是撑满屏幕*/
		height: 35px;/*这是设置高*/
		background-color: black;/*这是header标签的背景颜色*/
		color: white;/*这是字体颜色*/
		text-align:center;/*这是文字居中*/
		line-height: 35px;
		}
	 input[type="text"],input[type="password"]{
		line-height: 48px;
		margin-top: 10px;
		width: 35%;
		}/*这是设置账号框和密码框的样式,具体的需要说的太多,
		嗯....,
		那就请你们动动你们的小手去百度搜一下叭*/
		input[type="button"]{
		width: 35%;
		margin-top: 10px;
	}
	input[id='getCode']{
		line-height: 48px;
		margin-top: 10px;
		width: 8%;
	}
	input[name='code']{
		line-height: 48px;
		margin-top: 10px;
		width: 27%;
	}
</style> 
 </head> 
 <body> 
  <div>
   用户注册
  </div> 
  <div> 
   <input type="text" name="email" placeholder="请输入邮箱..." /> 
  </div> 
  <div> 
   <input type="password" name="password" placeholder="请输入密码..." /> 
  </div> 
  <div> 
   <input type="password" name="confirm" placeholder="确认密码..." /> 
  </div>  
  <div> 
   <input id="code" type="text" name="code" placeholder="验证码..." /> <input id="getCode" type="button" value="获取验证码" /> 
  </div> 
    <div> 
   <input id="codeBtn" type="button" value="注册" /> 
  </div>
 </body>
</html>